<html>
    <head>
            <meta charset = "utf-8">
    </head>
    <body>
    <div id = "wrapper">
    <div id = "header">头部</div>
    <div>
    <div id="content">
        <h2>Locally Roasted Free-Trade Coffee</h2>
        <p>Indulge in the aroma of freshly ground roast coffee.
            Specialty drinks are available hot or cold.
        </p>
    </div>
    <div id = "nav">
        <ul>
            <li><a>home menu</a></li>
            <li><a>direction</a></li>
            <li><a>contact</a></li>
        </ul>
    </div>
    </div>
    <div id = "footer">footer</div>
    
   <figure>
       <img src = "aaa.jgp" width="250" height="335" alt = "LIghthouse Island111">
       <figcaption>
           Island Lighthouse ,Built in 2007
       </figcaption>
   </figure>

    <div id="nav">这个是什么</div>
</div> 
<div calss = "figure1">
        <img src = "aaa.jpg" width= "250" height="350" alt = "lighthouse"><br>
        Island Lighthouse, Built in 1870
    </div>
    </body>
    <style>
   body {
       background-color: #00005d; font-faimly: Verdana,Arial,sans-serif;
   }
   .figure {
       float:right;
       width: 260px;
       margin: 10px;
       text-align: center;
       font-size: .8em;
       font-style: italic;
   }
   #wrapper {
       margin: 0 auto;
       width: 80%;
       min-width: 850px;
       background-color: #b3c7e6;
       color: #000066;
   }
   #header {
       background-color: #869dc7;
       color: #00005d;
       font-size: 150%;
       padding:10px 10px 10px 155px;
       background-repeat: no-repeat;
       background-image: url(aaa.jpg)
   }
   #content {
       background-color: #ffffff;
       color: #000000;
       padding: 10px 20px ;
       margin-right: 200px;
       overflow: auto;
   }
   #nav {
       float: right;
       width: 150px;
       font-weight: bold;
       letter-spacing: 0.1px;
   }
   #footer {
       font-size: 70%;
       text-align: center;
       padding: 10px;
       background-color: #869ec7;
       clear: both;
   }
    </style>
</html>